<template>
    <div class="centerContent">
        <div class="proLogo">
            <img :src="imgSrc">
        </div>
        <div class="proName">
            <div class="proNameTitle" >{{proNameTitle}}</div>
            <div class="proNameProd">{{proNameProd}}</div>
        </div>
        <div class="splitLine">
        </div>
        <div class="proTime">
            <div class="proTimeClock">{{this.$store.state.time}}</div>
            <div class="proTimeDate">{{this.$store.state.year+' '+this.$store.state.week}}</div>
        </div>
    </div>
</template>
<script>
export default {
    name: 'HeaderCenter',
    props:{
        proNameTitle: String,
    },
    data(){
        return{
            imgSrc: '/zjlogo.png', //相对于html路径
            proNameProd: 'GEOVIS iExplorer',
        }
    },
    mounted() {
        //钩子涉及到dom，设置css时需要渲染后才能生效，一般不用beforeMounte      
    },
    beforeDestroy(){
        clearInterval(this.timer);
        this.timer = null;
    },
    methods: {     
    }
}
</script>
<style lang="stylus" scoped>
    .centerContent
            width: 6.42rem
            height: 6.48vh
            .proLogo
                float:left
                width:.47rem
                height : 4.44vh
                margin-top: 1.1vh
                margin-left: .3rem
                img 
                    width: .47rem
                    height : 4.44vh
            .proName
                float:left
                margin-top: 1.11vh
                margin-left: .15rem
                margin-right: .15rem
                font-family: '方正正纤黑简体' 
                .proNameTitle
                    height: 1.85vh
                    width:  3.3rem
                    font-size: .25rem
                .changeFontSize
                    font-size: .16rem
                .proNameProd
                    width: 3.3rem
                    height: 1.5vh
                    color: #000
                    line-height: 1.5vh
                    font-size: .12rem
                    background : #59E1FE
                    margin-top: 1.3vh
                    text-indent : 0.06rem
                    letter-spacing : 2px
            .splitLine
                width: .02rem
                height: 4.44vh
                background: #59E1FE
                float:left
                margin-top: .12rem
                margin-right: .15rem
            .proTime
                float:left
                margin-top: .12rem
                font-family: Courier
                .proTimeClock
                    width: 1.26rem
                    height: 2.13vh
                    line-height: 2.13vh
                    font-family: Courier
                    font-size: .3rem
                    margin-bottom : 0.11rem 
                .proTimeDate
                    font-size: .16rem
                    line-height : 1.48vh
                    color: #59E1FE
                    letter-spacing: 0rem 
</style>